<template>
	<view>
		<button @click="Tologin()">123</button>
		<KeySearch></KeySearch>
		<view class="category_list" >
			<view class="category_item" @click="ToCatePage(item.id)" v-for="item in category_list_up" :key="item.id">
				<image :src="item.imageurl" ></image>
				<view>{{item.name}}</view>	
			</view>
		</view>
		<view class="transition_line">
			<view class="maybe_like">猜你喜欢</view>
			<view class="change_list">
				<view>换一批</view>
			</view>
		</view>
		<TeamList v-for="item in items" :team_information="item" :key="item.id"></TeamList>
		<BottomMenu></BottomMenu>
	</view>
</template>

<script>
	import BottomMenu from "@/components/BottomMenu.vue"
	import TeamList from "@/components/TeamList.vue"
	import KeySearch from "@/components/KeySearch.vue"
	export default {
		onLoad() {
			
		},
		data() {
			return {
				category_list_up:[{
					id:1,
					name:"空位",
					imageurl:"../../static/logo.png"
				},{
					id:2,
					name:"拼车",
					imageurl:"../../static/logo.png"
				},{
					id:3,
					name:"拼单",
					imageurl:"../../static/logo.png"
				},{
					id:4,
					name:"竞赛",
					imageurl:"../../static/logo.png"
				},{
					id:5,
					name:"运动",
					imageurl:"../../static/logo.png"
				},{
					id:6,
					name:"娱乐",
					imageurl:"../../static/logo.png"
				},{
					id:7,
					name:"自习",
					imageurl:"../../static/logo.png"
				},{
					id:8,
					name:"其它",
					imageurl:"../../static/logo.png"
				}],
				items:[{
					'id':'1',
					'imgurl':'123',
					'name':'拼车组队',
					'leader':'甲乙丙丁',
					'process':'3/5',
					'time':'2020',
					"teamid":1
				},{
					'id':'2',
					'imgurl':'123',
					'name':'拼车组队',
					'leader':'甲乙丙丁',
					'process':'3/5',
					'time':'2020'
				}]
			}
		},
		components:{
			BottomMenu:BottomMenu,
			TeamList,
			KeySearch
		},
		methods: {
			ToCatePage(id){
				uni.navigateTo({
					url:"../team_categorylist_page/team_categorylist_page?id="+id
				})
				console.log("跳转"+"../team_categorylist_page/team_categorylist_page?id="+id)
			},
			Tologin(){
				uni.navigateTo({
					url:"/pages/login/login"
				})
			}
		}
	}
</script>

<style>

.category_list  {
	display: flex;
	flex-direction: row;
	justify-content:space-between;
	flex-wrap: wrap;
	margin-top: 20rpx;
}
.category_item{
	width: 25%;
	text-align: center;
	
}
.category_list image{
	width: 60%;
	height: 100rpx;
}
.transition_line{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-top: 20rpx;
}
.transition_line .change_list{
	border-width: 1rpx;
	border-style: solid;
	border-radius: 50rpx;
	padding:0 50rpx 0 50rpx;
}
</style>
